var chartLeftMid = echarts.init(document.getElementById("left-mid"));

function chartLeftMidFunc(params) {
    $.ajax({
        type: "get",
        url: baseUrl + "aqi/getAqiLevelDistribution",
        success: function (data) {
            var list = []
            for (const v of data.data) {
                list.push({name: v.aqiLevel, value: v.count})
            }
            optionChartLeftMid = {
                title: {
                  show: true,
                  text: "空气质量指数级别分布",
                  textStyle: {
                    color: "#fff", //'red'，字体颜色
                    fontStyle: "normal", //'italic'(倾斜) | 'oblique'(倾斜体) ，字体风格
                    fontWeight: "normal", //'bold'(粗体) | 'bolder'(粗体) | 'lighter'(正常粗细) ，字体粗细
                    fontFamily: "sans-serif", //'sans-serif' | 'serif' | 'monospace' | 'Arial' | 'Courier New'
                    // 'Microsoft YaHei'(微软雅黑) ，文字字体
                    fontSize: 14, //字体大小
                    lineHeight: 14, //字体行高
                  },
                  textAlign: "auto", //整体（包括 text 和 subtext）的水平对齐
                  textVerticalAlign: "auto", //整体（包括 text 和 subtext）的垂直对齐
                  //padding:0,//[5,10] | [ 5,6, 7, 8] ,标题内边距
                  left: "35%", //'5' | '5%'，title 组件离容器左侧的距离
                  right: "auto", //'title 组件离容器右侧的距离
                  top: "2%", //title 组件离容器上侧的距离
                  bottom: "auto", //title 组件离容器下侧的距离
                },
                tooltip: {
                  trigger: "item",
                },
                legend: {
                  orient: "vertical",
                  left: "left",
                  top: "bottom",
                  textStyle: {
                    // 图例文字样式
                    color: "white",
                  },
                },
                series: [
                  {
                    name: "空气质量",
                    type: "pie",
                    radius: "50%",
                    data: list,
                    emphasis: {
                      itemStyle: {
                        shadowColor: "rgba(0, 0, 0, 0.5)",
                      },
                    },
                    label: {
                      show: true,
                      color: "white", // 图示文字颜色
                    },
                  },
                ],
              };
              
              chartLeftMid.setOption(optionChartLeftMid);
        }
    })
}

chartLeftMidFunc()

setInterval(() => {
    chartLeftMidFunc()
}, 5000);

